import React from 'react';
import { connect } from 'umi';
import { Tabs } from 'antd';
const { TabPane } = Tabs;
import { TabType } from '@/pages/ETrade/MediumAndLongTermMarket/constant.js';

export const HeaderTabs = (props) => {
  return (
    <Tabs activeKey={props.currentTab} size="large" onChange={props.setCurrentTab}>
      {(function () {
        let tabs = [];
        for (let key in TabType) {
          tabs.push(<TabPane tab={TabType[key].label} key={TabType[key].value} />);
        }
        return tabs;
      })()}
    </Tabs>
  );
};

const mapStateToProps = (state) => ({
  currentTab: state.mediumAndLongTermMarket.currentTab,
});

const mapDispatchToProps = (dispatch) => ({
  setCurrentTab: (payload) =>
    dispatch({
      type: 'mediumAndLongTermMarket/setCurrentTab',
      payload,
    }),
});

export default connect(mapStateToProps, mapDispatchToProps)(HeaderTabs);
